GNU MediaGoblin: the tour

<div class="grid_16">
  <h1>Take the tour! Here's what MediaGoblin offers...</h1>
  <div class="tour-block">
  <div class="grid_8 alpha">
    <h2>Sharing is Caring</h2>
    <p>
      Share your media with the world.  Run your own site, use one by
      a friend or family member, or something public.  MediaGoblin is
      <a href="http://www.gnu.org/philosophy/free-sw.html">free software</a>:
      anyone can run or improve it.
    </p>
  </div>
  <div class="grid_8 omega">
    <h2>Start a Conversation</h2>
    <p>
      Builtin commenting with markdown support for rich conversations.
    </p>
  </div>
  <div class="clear"></div>
  <div class="grid_8 alpha">
    <p class="tour-screenshot">
      <a href="/images/tour/mairin_profile.png"
         ><img src="/images/tour/mairin_profile-scaled.png"
               alt="Profile of user mairin" /></a>
    </p>
  </div>
  <div class="grid_8 omega">
    <p class="tour-screenshot">
      <a href="/images/tour/cupcake_discussion.png"
         ><img src="/images/tour/cupcake_discussion-scaled.png"
               alt="Discussing an image of a cupcake" /></a>
    </p>
  </div>
  <div class="grid_8 alpha">
    <h2>Show What Matters</h2>
    <p>
      Designed to show off your stuff without getting in the way.  Clean
      design that puts the spotlight where it really matters: your works.
    </p>
  </div>
  <div class="grid_8 omega">
    <h2>Meet Your Needs</h2>
    <p>
      Running your own site?  Drop in the storage system you need or
      enable neat features such as media attachments so your users can
      share the source files for their works.
    </p>
  </div>
  <div class="clear"></div>
  <div class="grid_8 alpha">
    <p class="tour-screenshot">
      <a href="/images/tour/elronds_jewel.png"
         ><img src="/images/tour/elronds_jewel-scaled.png"
               alt="Elrond's jewel" /></a>
    </p>
  </div>
  <div class="grid_8 omega">
    <p class="tour-screenshot">
      <a href="/images/tour/blender_attachment.png"
         ><img src="/images/tour/blender_attachment-scaled.png"
               alt="Downloadable blender attachment" /></a>
    </p>
  </div>
  <div class="clear"></div>
  <div class="grid_8 alpha">
    <h2>The World's Most Beautiful Media Future</h2>
    <p>
      Built with awesome technology
      (<a href="http://python.org">Python</a>,
       <a href="http://www.celeryproject.org/">Celery</a>,
       <a href="http://www.sqlalchemy.org/">SQLAlchemy</a>, and more) with a
      clean design for a future that's more than just image galleries.
      Video support is already here, and soon you'll be able to add
      plugins for almost any type of media publishing... including
      presentations or 3d model files.  And we're planning for
      federation with OStatus so we can build a decentralized yet
      cohesive media hosting future.

      MediaGoblin is more than just software, it's a community of
      people like you... programmers, artists, translators,
      administrators, and writers.  You can help us build this future
      by jumping in and becoming a contributor, an administrator, a
      user... or more than one of the above.
    </p>
  </div>
  <div class="grid_8 omega">
    <h2>Excited?  Jump in.</h2>

    <ul>
      <li>
        <b>Run it</b> --
        Learn more about running your own instance of MediaGoblin.

        Check out our step-by-step
        <a href="http://docs.mediagoblin.org/">guide to installing MediaGoblin</a>
        on your own server.
      </li>
      <li>
        <b>Use it</b> --
        Get started using Mediagoblin with an existing community.
        <a href="http://wiki.mediagoblin.org/Live_instances">Find
        sites already running MediaGoblin</a>.
      </li>
      <li>
        <b>Join us</b> --
        MediaGoblin is built by a vibrant and friendly community of people like you!

        Learn more about <a href="/pages/join.html">getting involved</a>
        or <a href="http://wiki.mediagoblin.org/HackingHowto">setting
        up a local instance for development</a>!
      </li>
    </ul>
  </div>
  <div class="clear"></div>
  <div class="grid_8 alpha">
    <p class="tour-screenshot">
      <a href="/images/tour/sintel_video.png"
         ><img src="/images/tour/sintel_video-scaled.png"
               alt="Sintel video test" /></a>
      <br />
      <i>(Image from <a href="http://sintel.org/">Sintel</a> by the
        <a href="http://www.blender.org/blender-institute/">Blender Institute</a>,
        released under
        <a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons Attribution 3.0 Unported</a>)
      </i>
    </p>
  </div>
  <div class="grid_8 omega">
    <p><!--more text would go here, if we had any! --></p>
  </div>
  <div class="clear"></div>
</div>
</div>
